<template>
  <div
      style="height:100%;width:100%;border-radius: 0px;border:2px #838383 solid;text-align: center;box-sizing: border-box;position: relative;"
      @mousemove="handleMousemove($event)">
    <div style="position: absolute;left:50%;top:50%;text-align: center;"
         :style='{"transform":"translate(-50%,-50%) scale("+zoom+")",width:props.option.w*0.8+"px"}'
    >{{ props.option.option.label }}
    </div>
    <div v-if="props.option.selected" style="position: absolute;left:100%;top:0;width:50px ;">
      <span @click="handleStartLink($event)">操作按钮</span>
    </div>
  </div>
</template>
<script setup lang="ts">
import {ComponentAnchor, ComponentOption} from "../../..//ComponentOption.ts";
import {inject, onUnmounted} from "vue";
import EventBus from "../../../EventBus.ts";
import {distance2d} from "@/components/MPanel/util.ts";
import {useHandleLinkEdit} from "../handleLinkEdit.ts";

const panelEvents: any = inject("panelEvents")
const eventBus: EventBus = inject("eventBus")
const panelStatus: any = inject("panelStatus")
const panelApi: any = inject("panelApi")
const props = defineProps<{
  option: ComponentOption,
  zoom: number,
}>();
const {handleMousemove, handleStartLink} = useHandleLinkEdit(panelStatus, panelApi, props.option, panelEvents, eventBus)

onUnmounted(() => {
  //卸掉事件监听
})

</script>
